﻿@model Unijovem.UI.Models.ComentarioModel
@{
    ViewBag.Title = "Criar";
}
@if (Model.UsuarioEstaLogado)
{   
    <link href="@Url.Content("~/Content/jquery.cleditor.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery.cleditor.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.cleditor.xhtml.min.js")" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function () {
        $("#@string.Concat("botao", Model.IdExterno)").corner("round 11px");
        $("#@string.Concat("foto", Model.IdExterno)").corner("round 10px");
        $.cleditor.defaultOptions.width = 600;
        $.cleditor.defaultOptions.height = 90;
        $.cleditor.defaultOptions.controls = "bold italic underline color";
        $("#@string.Concat("Descricao", Model.IdExterno)").cleditor();
        $("#@string.Concat("Descricao", Model.IdExterno)").cleditor()[0].change(function () {      
                var limit = parseInt($("#@string.Concat("Descricao", Model.IdExterno)").attr('maxlength'));
                var text = $("#@string.Concat("Descricao", Model.IdExterno)").val();
                var chars = text.length;

                var div =  $("#@string.Concat("divErro", Model.IdExterno)");
                var divbotao = $("#@string.Concat("botao", Model.IdExterno)");
                var botao = $("#@string.Concat("comentar", Model.IdExterno)");

                if (chars > limit) {
                    div.show();
                    divbotao.removeClass("botaoVerde");
                    divbotao.addClass("botaoInativo");
                    botao.removeClass("botaoVerde");
                    botao.addClass("botaoInativo");
                    botao.attr("disabled", true); 
                    $("#@string.Concat("textoErro", Model.IdExterno)").text("Seu comentário deve ter até " + limit + " caracteres, porém ele contém " + chars + " caracteres.");
                }
                else{
                    div.hide();
                    divbotao.removeClass("botaoInativo");
                    divbotao.addClass("botaoVerde");
                    botao.removeClass("botaoInativo");
                    botao.addClass("botaoVerde");
                    botao.removeAttr("disabled"); 
                }
            });

        $("#@string.Concat("Comentar", Model.IdExterno)").click(function () {
            var limit = parseInt($("#@string.Concat("Descricao", Model.IdExterno)").attr('maxlength'));
            var text = $("#@string.Concat("Descricao", Model.IdExterno)").val();
            if (text.length > limit) return;

            var params = { idExterno: $("#@string.Concat("IdExterno", Model.IdExterno)").val(),
                           tipo: $("#@string.Concat("Tipo", Model.IdExterno)").val() ,
                           comentario: $("#@string.Concat("Descricao", Model.IdExterno)").val() 
                        };

            $.ajax({ type: "POST",
                url: "/Comentario/Comentar",
                data:params,
                success: function (result) {
                    $("#@string.Concat("Descricao", Model.IdExterno)").cleditor()[0].clear();
                    var divComentario = $("#@string.Concat("divComentarios", Model.IdExterno)");

                    if(divComentario == null || divComentario.length == 0){
                        location.reload();
                    }
                    else{
                        divComentario.html(result + divComentario.html());
                        $("#SemComentarios").hide();
                    }
                },
                error: function (xhr, status, error) {
                    var err = xhr.responseText;
                    alert("Sorry! We could not receive your feedback at this time." + err);
                }
            });
        });
    });
    </script>
    <div id="@string.Concat("dialog-modal", Model.IdExterno)" title="Pré-visualização">
    </div>
    <div style="border-bottom: 2px solid black; height: 24px;">
        <h2>
            Comentários</h2>
    </div>
        using (Html.BeginForm())
        {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Comentario</legend>
        @Html.HiddenFor(model => model.IdPessoa, new { id = string.Concat("IdPessoa", Model.IdExterno) })
        @Html.HiddenFor(model => model.IdExterno, new { id = string.Concat("IdExterno", Model.IdExterno) })
        @Html.HiddenFor(model => model.Tipo, new { id = string.Concat("Tipo", Model.IdExterno) })
        <div class="floatLeft" style="padding-top: 20px;">
            <div class="floatLeft" style="padding: 12px; height: 95px;">
                <div id="@string.Concat("foto", Model.IdExterno)">
                    @Html.Partial("~/Views/PartialView/FotoUsuario.cshtml", new Unijovem.UI.Models.FotoUsuarioModel { MaxHeight = 110, MaxWidth = 110, Pessoa = Model.PessoaLogada, ClasseCssImagem = "borderVerde" })
                </div>
            </div>
            <div class="floatLeft">
                <div class="borderVerde">
                    @Html.TextAreaFor(model => model.Descricao, new { id = string.Concat("Descricao", Model.IdExterno), maxlength = 1024 })
                    @Html.ValidationMessageFor(model => model.Descricao)
                </div>
                <div id="@string.Concat("divErro", Model.IdExterno)" style="display:none;">
                    <br />
                    <span id="@string.Concat("textoErro", Model.IdExterno)" class="error"></span>
                </div>
            </div>
            <div style="clear: both;">
            </div>
            <div class="floatRight botaoVerde" id="@string.Concat("botao", Model.IdExterno)" >
                <a id="@string.Concat("Comentar", Model.IdExterno)">Comentar</a>
            </div>
        </div>
    </fieldset>
        }
}
else
{
    @Html.Partial("~/Views/PartialView/UsuarioNaoLogado.cshtml", "Para enviar um comentário você deve estar logado no site.")
}